//渲染发布文章页面的请求分类项目
axios.get('http://api-breakingnews-web.itheima.net/my/article/cates', {
    headers: {
        Authorization: localStorage.getItem('token')
    }
}).then(function (test) {

    const {data, message, status} = test.data
    if (status === 0) {
        data.forEach(function (item) {

            let option = `<option value="${item.Id}" lay-verify="cate">${item.name}</option>`
            $('select[name=cate_id]').append(option)
            layui.form.render('select', 'edit');
        })

    }

})
//文本输入框初始化
function initTinyMce() {
    tinymce.init({
        selector: 'textarea[name=content]', //容器，可使用css选择器
        language: 'zh_CN', //调用放在langs文件夹内的语言包
        plugins: ['link', 'table', 'image'], //选择需加载的插件
        // //选中时出现的快捷工具，与插件有依赖关系
    });
}
initTinyMce();

//图片裁剪功能
let cropper = new Cropper($('#image')[0],{
    aspectRatio:1,
    preview:$('.img-preview')
})
//选择图片进行裁剪
$('.select').on('click' , function () {
    $('#file').click()
})
$('#file').on('change',function () {
    let files = this.files[0]
    let url = URL.createObjectURL(files)
    cropper.replace(url)
})

//提交事件,上传数据
$('form').on('submit', function (e) {
    e.preventDefault()
    //提取富文本里面的内容
    const htmlStr = tinyMCE.activeEditor.getContent()
    //提取裁剪区域的图片
    const canvas = cropper.getCroppedCanvas({
        width: 100,
        height: 100,
    })

    let fd = new FormData($('form')[0])
    fd.set('content',htmlStr)
    canvas.toBlob(function (blobObj) {
        fd.append('cover_img',blobObj)
        axios.post('http://api-breakingnews-web.itheima.net/my/article/add',fd,{
            headers: {
                Authorization: localStorage.getItem('token')
            }
        }).then(function (test) {
            if (test.data.status === 0) {
                layer.msg(test.data.message)
                $('form')[0].reset()
                location.href = './../list/list.html'
            }
        })
    })

})

// publisher页面 - 文章标题
const form = layui.form;
form.verify({
    articleTitle: [
        /^[\u4E00-\u9FA5a-zA-Z0-9_-]+$/,
        "标题只能是中英文, 数字下划线中划线组成"
    ],
    // 分类判断
    cate: function () {
        return $("select[name=cate_id]").val().length == 0 && "请选择文章类别"
    }
})